import { type RouteRecordRaw, createRouter } from "vue-router"
import { history, flatMultiLevelRoutes } from "./helper"
import routeSettings from "@/config/route"

const Layouts = () => import("@/layouts/index.vue")

/**
 * 常驻路由
 * 除了 redirect/403/404/login 等隐藏页面，其他页面建议设置 Name 属性
 */
export const constantRoutes: RouteRecordRaw[] = [
  {
    path: "/redirect",
    component: Layouts,
    meta: {
      hidden: true
    },
    children: [
      {
        path: "/redirect/:path(.*)",
        component: () => import("@/views/redirect/index.vue")
      }
    ]
  },
  {
    path: "/403",
    component: () => import("@/views/error-page/403.vue"),
    meta: {
      hidden: true
    }
  },
  {
    path: "/404",
    component: () => import("@/views/error-page/404.vue"),
    meta: {
      hidden: true
    },
    alias: "/:pathMatch(.*)*"
  },
  {
    path: "/login",
    component: () => import("@/views/login/index.vue"),
    meta: {
      hidden: true
    }
  },
  {
    path: "/",
    component: Layouts,
    redirect: "/company",
    name: "company",
    meta: {
      title: "网站首页",
      elIcon: "Grid"
    },
    children: [
      {
        path: "",
        component: () => import("@/views/company/index.vue"),
        name: "companyInfo",
        meta: {
          title: "公司信息",
          keepAlive: true
        }
      },

      {
        path: "/banners",
        component: () => import("@/views/banners/index.vue"),
        name: "banners",
        meta: {
          title: "轮播图",
          keepAlive: true
        }
      },
      {
        path: "/banners/operate/:id?",
        component: () => import("@/views/banners/operate.vue"),
        name: "bannersOperate",
        meta: {
          title: "轮播图配置",
          keepAlive: true,
          hidden: true
        }
      }
    ]
  },
  {
    path: "/about",
    component: Layouts,
    redirect: "/companyDevelopmentHistory",
    name: "about",
    meta: {
      title: "关于我们",
      elIcon: "UserFilled"
    },
    children: [
      {
        path: "/companyDevelopmentHistory",
        component: () => import("@/views/companyDevelopmentHistory/index.vue"),
        name: "companyDevelopmentHistory",
        meta: {
          title: "发展历程",
          keepAlive: true
        }
      },
      {
        path: "/companyDevelopmentHistory/operate/:id?",
        component: () => import("@/views/companyDevelopmentHistory/operate.vue"),
        name: "companyDevelopmentHistoryOperate",
        meta: {
          title: "新增/修改发展历程",
          keepAlive: true,
          hidden: true
        }
      },
      {
        path: "/pages",
        component: () => import("@/views/pages/index.vue"),
        name: "pages",
        meta: {
          title: "页面列表",
          keepAlive: true
        }
      },
      {
        path: "/pages/operate/:id?",
        component: () => import("@/views/pages/operate.vue"),
        name: "pagesOperate",
        meta: {
          title: "新增/修改页面",
          keepAlive: true,
          hidden: true
        }
      }
    ]
  },
  {
    path: "/products",
    component: Layouts,
    redirect: "/products",
    name: "productCenter",
    meta: {
      title: "产品中心",
      elIcon: "Grid"
    },
    children: [
      {
        path: "/products",
        component: () => import("@/views/products/index.vue"),
        name: "products",
        meta: {
          title: "产品分类",
          keepAlive: true
        }
      },
      {
        path: "/products/operate/:id?",
        component: () => import("@/views/products/operate.vue"),
        name: "productsOperate",
        meta: {
          title: "新增/修改产品分类",
          keepAlive: true,
          hidden: true
        }
      },
      {
        path: "/products/children",
        component: () => import("@/views/products/children/index.vue"),
        name: "productsChildren",
        meta: {
          title: "产品列表",
          keepAlive: true
        }
      },
      {
        path: "/products/childrenOperate/:categoryId/:id?",
        component: () => import("@/views/products/children/operate.vue"),
        name: "productsChildrenOperate",
        meta: {
          title: "新增/修改产品",
          keepAlive: true,
          hidden: true
        }
      },
      {
        path: "/projects",
        component: () => import("@/views/projects/index.vue"),
        name: "projects",
        meta: {
          title: "项目列表",
          keepAlive: true
        }
      },
      {
        path: "/projects/operate/:id?",
        component: () => import("@/views/projects/operate.vue"),
        name: "projectsOperate",
        meta: {
          title: "新增/修改项目",
          keepAlive: true,
          hidden: true
        }
      },
      {
        path: "/buildType",
        component: () => import("@/views/buildType/index.vue"),
        name: "buildType",
        meta: {
          title: "建筑类型",
          keepAlive: true
        }
      },
      {
        path: "/buildType/operate/:id?",
        component: () => import("@/views/buildType/operate.vue"),
        name: "buildTypeOperate",
        meta: {
          title: "新增/修改建筑类型",
          keepAlive: true,
          hidden: true
        }
      }
    ]
  },
  {
    path: "/news",
    component: Layouts,
    redirect: "/news",
    name: "News",
    meta: {
      title: "新闻资讯",
      elIcon: "Grid"
    },
    children: [
      {
        path: "",
        component: () => import("@/views/news/index.vue"),
        name: "news",
        meta: {
          title: "新闻资讯",
          keepAlive: true
        }
      },
      {
        path: "operate/:id?",
        component: () => import("@/views/news/operate.vue"),
        name: "newsOperate",
        meta: {
          title: "新增/修改新闻",
          keepAlive: true,
          hidden: true
        }
      }
    ]
  },
  {
    path: "/case",
    component: Layouts,
    redirect: "/case",
    name: "case",
    meta: {
      title: "优秀案例",
      elIcon: "UserFilled"
    },
    children: [
      {
        path: "/case",
        component: () => import("@/views/case/index.vue"),
        name: "case",
        meta: {
          title: "优秀案例",
          keepAlive: true
        }
      },
      {
        path: "/case/operate/:id?",
        component: () => import("@/views/case/operate.vue"),
        name: "caseOperate",
        meta: {
          title: "新增/修改案例",
          keepAlive: true,
          hidden: true
        }
      }
    ]
  },
  {
    path: "/systemManage",
    component: Layouts,
    redirect: "/systemManage/webSiteConfig",
    name: "systemManage",
    meta: {
      title: "系统管理",
      elIcon: "Tools"
    },
    children: [
      {
        path: "webSiteConfig",
        component: () => import("@/views/systemManage/webSiteConfig/index.vue"),
        name: "webSiteConfig",
        meta: {
          title: "站点配置",
          keepAlive: true
        }
      },
      {
        path: "users",
        component: () => import("@/views/systemManage/users/index.vue"),
        name: "users",
        meta: {
          title: "用户列表",
          keepAlive: true
        }
      },
      {
        path: "users/operate/:id?",
        component: () => import("@/views/systemManage/users/operate.vue"),
        name: "usersOperate",
        meta: {
          title: "新增/修改用户",
          keepAlive: true,
          hidden: true
        }
      }
    ]
  }
]

/**
 * 动态路由
 * 用来放置有权限 (Roles 属性) 的路由
 * 必须带有 Name 属性
 */
export const asyncRoutes: RouteRecordRaw[] = [
  {
    path: "/:pathMatch(.*)*", // Must put the 'ErrorPage' route at the end, 必须将 'ErrorPage' 路由放在最后
    redirect: "/404",
    name: "ErrorPage",
    meta: {
      hidden: true
    }
  }
]

const router = createRouter({
  history,
  routes: routeSettings.thirdLevelRouteCache ? flatMultiLevelRoutes(constantRoutes) : constantRoutes
})

/** 重置路由 */
export function resetRouter() {
  // 注意：所有动态路由路由必须带有 Name 属性，否则可能会不能完全重置干净
  try {
    router.getRoutes().forEach((route) => {
      const { name, meta } = route
      if (name && meta.roles?.length) {
        router.hasRoute(name) && router.removeRoute(name)
      }
    })
  } catch {
    // 强制刷新浏览器也行，只是交互体验不是很好
    window.location.reload()
  }
}

export default router
